/**
 * Copyright 2025 Beijing Volcano Engine Technology Co., Ltd. All Rights Reserved.
 * SPDX-license-identifier: BSD-3-Clause
 */

import { useSelector } from 'react-redux';
import { Button } from '@arco-design/web-react';
import { useState } from 'react';
import AISettings from '../AISettings';
import style from './index.module.less';
import DouBaoAvatar from '@/assets/AiImgs/touxiang.png';
import { RootState } from '@/store';
import { MODEL_MODE, Name, VOICE_TYPE } from '@/config';
import { Image } from 'react-vant';

interface IAvatarCardProps extends React.HTMLAttributes<HTMLDivElement> {
  avatar?: string;
}

const ReversedVoiceType = Object.entries(VOICE_TYPE).reduce<Record<string, string>>(
  (acc, [key, value]) => {
    acc[value] = key;
    return acc;
  },
  {}
);

const SourceName = {
  [MODEL_MODE.VENDOR]: '第三方模型',
  [MODEL_MODE.COZE]: 'Coze',
};

function AvatarMobileCard(props: IAvatarCardProps) {
  const room = useSelector((state: RootState) => state.room);
  const { scene, aiConfig, modelMode } = room;
  const [open, setOpen] = useState(false);
  const { LLMConfig, TTSConfig } = aiConfig.Config || {};
  const { avatar, className, ...rest } = props;
  const voice = TTSConfig?.ProviderParams?.audio?.voice_type;
  const userPhoto = sessionStorage.getItem('USERPHOTO')

  const handleOpenDrawer = () => setOpen(true);
  const handleCloseDrawer = () => setOpen(false);

  return (
    <div className={` ${style.avatar} mt-14` } style={{borderRadius: '50%'}}>
      <Image
        round
        fit='cover'
        width={200}
        height={200}
        src={userPhoto || DouBaoAvatar}
        // className={style['doubao-gif']}
        alt="Avatar"
      />
    </div>
  );
}

export default AvatarMobileCard;
